// JavaScript Document
$(document).ready(function() {
	$('#resetButton').button({
		icons: {primary: 'ui-icon-arrowreturnthick-1-w'},
		label: 'Reset'
	}).click(function() {
		$('#resetNotification').fadeIn('slow', function() {
			localStorage['options'] = JSON.stringify(defaultOptions);
			location.reload();
		});
	});
	var defaultOptions = JSON.parse(localStorage['defaultOptions']);
	if (localStorage['options'] == null || undefined || '')
		localStorage['options'] = localStorage['defaultOptions'];
	var options = JSON.parse(localStorage['options']);
	$('#version').val(options.version);
	$('input:radio[name=mainBackgroundType]')[options.mainBackgroundType].checked = true;
	$('input:radio[name=rounded_corners]')[options.rounded_corners].checked = true;
	$('#mainBackgroundGradientFrom').val(options.mainBackgroundGradientFrom);
	$('#mainBackgroundGradientTo').val(options.mainBackgroundGradientTo);
	$('#mainBackgroundSolid').val(options.mainBackgroundSolid);
	$('#mainBackgroundUrl').val(options.mainBackgroundUrl);
	$('#bgIMGTiled').attr('checked', options.bgIMGTiled);
	$('#reload_fb').attr('checked', options.reload_fb);
	$('#bgFirstPage').attr('checked', options.bgFirstPage);
	$('#message_border').attr('checked', options.message_border);
	$('#message_shadow').attr('checked', options.message_shadow);
	$('#message_bg').attr('checked', options.message_bg);
	$('#barTransparencyNormal').val(options.barTransparencyNormal);
	$('#barTransparencyHover').val(options.barTransparencyHover);
	$('#leftTransparencyNormal').val(options.leftTransparencyNormal);
	$('#leftTransparencyHover').val(options.leftTransparencyHover);
	$('#rightTransparencyNormal').val(options.rightTransparencyNormal);
	$('#rightTransparencyHover').val(options.rightTransparencyHover);
	$('#contentAreaTransparencyNormal').val(options.contentAreaTransparencyNormal);
	$('#contentAreaTransparencyHover').val(options.contentAreaTransparencyHover);
	$('#left_sidebar_fixed').attr('checked', options.leftColFixed);
	$('#right_sidebar_fixed').attr('checked', options.rightColFixed);
	$('#menu_bar_fixed').attr('checked', options.navBarFixed);
	$('#barRoundCorners').attr('checked', options.barRoundCorners);
	$('#barShadows').attr('checked', options.barShadows);
	$('#postShadows').attr('checked', options.postShadows);
	$('#addLogout').attr('checked', options.addLogout);
	$('#changeTitle').attr('checked', options.changeTitle);
	$('#keyboardShortcuts').attr('checked', options.keyboardShortcuts);
	$('#emoticonBar').attr('checked', options.emoticonBar);
	$('#lfdefault').attr('checked', options.lfdefault);
	$('#roboform').attr('checked', options.roboform);
	$('#faviconAlerts').attr('checked', options.faviconAlerts);
	$('#audioalert').attr('checked', options.audioalert);
	$("input[name='audiosound'][value='"+options.audiosound+"']").attr("checked","checked");
	$('#audioreminder').attr('checked', options.audioreminder);
	$("input[name='audiotimer'][value='"+options.audiotimer+"']").attr("checked","checked");
	$('#menu_bar_transparent').attr('checked', options.transperentFBBar);
	$('#left_sidebar_transparent').attr('checked', options.transperentLeftBar);
	$('#right_sidebar_transparent').attr('checked', options.transperentRightBar);
	$('#transperentMainContent').attr('checked', options.transperentcontentArea);
	$('#hideReqbox').attr('checked', options.hideReqbox);
	$('#hideAdbox').attr('checked', options.hideAdbox);
	$('#hideEventbox').attr('checked', options.hideEventbox);
	$('#hidePokebox').attr('checked', options.hidePokebox);
	$('#hideConnectbox').attr('checked', options.hideConnectbox);
	$('#hideSuggestionsbox').attr('checked', options.hideSuggestionsbox);
	$('#hidePageSuggestionbox').attr('checked', options.hidePageSuggestionbox);
	$('#hideOnlineFriends').attr('checked', options.hideOnlineFriends);
	$('#hideSyndicationbox').attr('checked', options.hideSyndicationbox);
	$('#optlink_account').attr('checked', options.optlink_account);
	$('#optlink_main').attr('checked', options.optlink_main);
	$('#resetButton').button({
		icons: {primary: 'ui-icon-arrowreturnthick-1-w'},
		label: 'Reset'
	}).click(function() {
		$('#resetNotification').fadeIn('slow', function() {
			localStorage['options'] = JSON.stringify(defaultOptions);
			location.reload();
		});
	});
	$('#submitButton').button({
		icons: {primary: 'ui-icon-disk'},
		label: 'Save'
	}).click(function() {
		localStorage['options'] = JSON.stringify({
			'version': $('#version').val(),
			'mainBackgroundType': $('input[name=mainBackgroundType]:checked').val(),
			'rounded_corners': $('input[name=rounded_corners]:checked').val(),
			'mainBackgroundGradientFrom': $('#mainBackgroundGradientFrom').val(),
			'mainBackgroundGradientTo': $('#mainBackgroundGradientTo').val(),
			'mainBackgroundSolid': $('#mainBackgroundSolid').val(),
			'mainBackgroundUrl': $('#mainBackgroundUrl').val(),
			'bgIMGTiled': $('#bgIMGTiled').attr('checked'),
			'reload_fb': $('#reload_fb').attr('checked'),
			'bgFirstPage': $('#bgFirstPage').attr('checked'),
			'message_border': $('#message_border').attr('checked'),
			'message_shadow': $('#message_shadow').attr('checked'),
			'message_bg': $('#message_bg').attr('checked'),
			'barTransparencyNormal': $('#barTransparencyNormal').val(),
			'barTransparencyHover': $('#barTransparencyHover').val(),
			'leftTransparencyNormal': $('#leftTransparencyNormal').val(),
			'leftTransparencyHover': $('#leftTransparencyHover').val(),
			'rightTransparencyNormal': $('#rightTransparencyNormal').val(),
			'rightTransparencyHover': $('#rightTransparencyHover').val(),
			'contentAreaTransparencyNormal': $('#contentAreaTransparencyNormal').val(),
			'contentAreaTransparencyHover': $('#contentAreaTransparencyHover').val(),
			'leftColFixed': $('#left_sidebar_fixed').attr('checked'),
			'rightColFixed': $('#right_sidebar_fixed').attr('checked'),
			'navBarFixed': $('#menu_bar_fixed').attr('checked'),
			'barRoundCorners': $('#barRoundCorners').attr('checked'),
			'barShadows': $('#barShadows').attr('checked'),
			'optlink': $('input[name=optlink]:checked').val(),
			'postShadows': $('#postShadows').attr('checked'),
			'addLogout': $('#addLogout').attr('checked'),
			'changeTitle': $('#changeTitle').attr('checked'),
			'keyboardShortcuts': $('#keyboardShortcuts').attr('checked'),
			'emoticonBar': $('#emoticonBar').attr('checked'),
			'lfdefault': $('#lfdefault').attr('checked'),
			'roboform': $('#roboform').attr('checked'),
			'faviconAlerts': $('#faviconAlerts').attr('checked'),
			'audioalert': $('#audioalert').attr('checked'),
			'audiosound': $('input[name=audiosound]:checked').val(),
			'audioreminder': $('#audioreminder').attr('checked'),
			'audiotimer': $('input[name=audiotimer]:checked').val(),
			'transperentFBBar': $('#menu_bar_transparent').attr('checked'),
			'transperentLeftBar': $('#left_sidebar_transparent').attr('checked'),
			'transperentRightBar': $('#right_sidebar_transparent').attr('checked'),
			'transperentcontentArea': $('#transperentMainContent').attr('checked'),
			'hideReqbox': $('#hideReqbox').attr('checked'),
			'hideAdbox': $('#hideAdbox').attr('checked'),
			'hideEventbox': $('#hideEventbox').attr('checked'),
			'hidePokebox': $('#hidePokebox').attr('checked'),
			'hideConnectbox': $('#hideConnectbox').attr('checked'),
			'hidePageSuggestionbox': $('#hidePageSuggestionbox').attr('checked'),
			'hideSuggestionsbox': $('#hideSuggestionsbox').attr('checked'),
			'hideOnlineFriends': $('#hideOnlineFriends').attr('checked'),
			'hideSyndicationbox': $('#hideSyndicationbox').attr('checked'),
			'optlink_account': $('#optlink_account').attr('checked'),
			'optlink_main': $('#optlink_main').attr('checked')
		});
		$('#saveNotification').fadeIn('slow', function(){
			chrome.extension.sendRequest({reqtype: 'options'}, function(response) {
				if(response.options.reload_fb){
					chrome.tabs.getAllInWindow(undefined, function(tabs) {
						for (var i = 0, tab; tab = tabs[i]; i++) {
							if (tab.url.indexOf("facebook.com") >= 0) {
								chrome.tabs.update(tab.id, {url: tab.url});
							}
						}
					});
				}
			});
			$('#saveNotification').delay(2000).fadeOut('slow', function(){
				location.reload();
			})
		});
	});
	
	$('#content').tabs({
		disabled: [],
		selected : 0,
		fx: {height: 'toggle', opacity: 'toggle'}
	});
	
	$( "#style_settings_bars" ).accordion({
		autoHeight: false,
		navigation: true
	});
	
	var main_normal = $('#contentAreaTransparencyNormal').val();
	var main_hover = $('#contentAreaTransparencyHover').val();
	var bar_normal = $('#barTransparencyNormal').val();
	var bar_hover = $('#barTransparencyHover').val();
	var left_normal = $('#leftTransparencyNormal').val();
	var left_hover = $('#leftTransparencyHover').val();
	var right_normal = $('#rightTransparencyNormal').val();
	var right_hover = $('#rightTransparencyHover').val();
	
	$( "#mainTransparency-slider" ).slider({
		range: true,
		min: 0,
		max: 100,
		values: [ main_normal, main_hover ],
		slide: function( event, ui ) {
			$("#mainTransparency").val(ui.values[ 0 ] + " - " + ui.values[ 1 ] );
			$('#contentAreaTransparencyNormal').val(ui.values[ 0 ]);
			$('#contentAreaTransparencyHover').val(ui.values[ 1 ]);
		}
	});
	$( "#mainTransparency" ).val($( "#mainTransparency-slider" ).slider( "values", 0 ) + " - " + $( "#mainTransparency-slider" ).slider( "values", 1 ) );
	
	$( "#menuTransparency-slider" ).slider({
		range: true,
		min: 0,
		max: 100,
		values: [ bar_normal, bar_hover ],
		slide: function( event, ui ) {
			$( "#menuTransparency" ).val(ui.values[ 0 ] + " - " + ui.values[ 1 ] );
			$('#barTransparencyNormal').val(ui.values[ 0 ]);
			$('#barTransparencyHover').val(ui.values[ 1 ]);
		}
	});
	$( "#menuTransparency" ).val($( "#menuTransparency-slider" ).slider( "values", 0 ) + " - " + $( "#menuTransparency-slider" ).slider( "values", 1 ) );
	
	$( "#leftTransparency-slider" ).slider({
		range: true,
		min: 0,
		max: 100,
		values: [ left_normal, left_hover ],
		slide: function( event, ui ) {
			$( "#leftTransparency" ).val(ui.values[ 0 ] + " - " + ui.values[ 1 ] );
			$('#leftTransparencyNormal').val(ui.values[ 0 ]);
			$('#leftTransparencyHover').val(ui.values[ 1 ]);
		}
	});
	$( "#leftTransparency" ).val($( "#leftTransparency-slider" ).slider( "values", 0 ) + " - " + $( "#leftTransparency-slider" ).slider( "values", 1 ) );
	
	$( "#rightTransparency-slider" ).slider({
		range: true,
		min: 0,
		max: 100,
		values: [ right_normal, right_hover ],
		slide: function( event, ui ) {
			$( "#rightTransparency" ).val(ui.values[ 0 ] + " - " + ui.values[ 1 ] );
			$('#rightTransparencyNormal').val(ui.values[ 0 ]);
			$('#rightTransparencyHover').val(ui.values[ 1 ]);
		}
	});
	$( "#rightTransparency" ).val($( "#rightTransparency-slider" ).slider( "values", 0 ) + " - " + $( "#rightTransparency-slider" ).slider( "values", 1 ) );
	
	document.getElementById('main_demo_test').style.opacity=$('#contentAreaTransparencyNormal').val()/100;
	document.getElementById('main_demo_test').onmouseover = function(e) { 
		document.getElementById('main_demo_test').style.opacity=$('#contentAreaTransparencyHover').val()/100;
	}; 
	document.getElementById('main_demo_test').onmouseout = function(e) { 
		document.getElementById('main_demo_test').style.opacity=$('#contentAreaTransparencyNormal').val()/100;
	};

	document.getElementById('menu_demo_test').style.opacity=$('#barTransparencyNormal').val()/100;
	document.getElementById('menu_demo_test').onmouseover = function(e) { 
		document.getElementById('menu_demo_test').style.opacity=$('#barTransparencyHover').val()/100;
	}; 
	document.getElementById('menu_demo_test').onmouseout = function(e) { 
		document.getElementById('menu_demo_test').style.opacity=$('#barTransparencyNormal').val()/100;
	};

	document.getElementById('left_demo_test').style.opacity=$('#leftTransparencyNormal').val()/100;
	document.getElementById('left_demo_test').onmouseover = function(e) { 
		document.getElementById('left_demo_test').style.opacity=$('#leftTransparencyHover').val()/100;
	}; 
	document.getElementById('left_demo_test').onmouseout = function(e) { 
		document.getElementById('left_demo_test').style.opacity=$('#leftTransparencyNormal').val()/100;
	};

	document.getElementById('right_demo_test').style.opacity=$('#rightTransparencyNormal').val()/100;
	document.getElementById('right_demo_test').onmouseover = function(e) { 
		document.getElementById('right_demo_test').style.opacity=$('#rightTransparencyHover').val()/100;
	}; 
	document.getElementById('right_demo_test').onmouseout = function(e) { 
		document.getElementById('right_demo_test').style.opacity=$('#rightTransparencyNormal').val()/100;
	};
	
	
	
    var f = $.farbtastic('#picker');
    var p = $('#picker').css('opacity', 0.25);
    var selected;
    $('.colorwell')
      .each(function () { f.linkTo(this); $(this).css('opacity', 0.75); })
      .focus(function() {
        if (selected) {
          $(selected).css('opacity', 0.75).removeClass('colorwell-selected');
        }
        f.linkTo(this);
        p.css('opacity', 1);
        $(selected = this).css('opacity', 1).addClass('colorwell-selected');
      });
	
	chrome.extension.sendRequest({reqtype: 'options'}, function(response) {
		
		if(response.options.version != "209" || response.options.version == null){
			$( "#update_notification" ).dialog({
				resizable: false,
				height:280,
				width:500,
				modal: true,
				buttons: {
					"Ok": function() {
						document.getElementById("version").value = "209";
						localStorage['options'] = JSON.stringify({
							'version': $('#version').val(),
							'mainBackgroundType': $('input[name=mainBackgroundType]:checked').val(),
							'rounded_corners': $('input[name=rounded_corners]:checked').val(),
							'mainBackgroundGradientFrom': $('#mainBackgroundGradientFrom').val(),
							'mainBackgroundGradientTo': $('#mainBackgroundGradientTo').val(),
							'mainBackgroundSolid': $('#mainBackgroundSolid').val(),
							'mainBackgroundUrl': $('#mainBackgroundUrl').val(),
							'bgIMGTiled': $('#bgIMGTiled').attr('checked'),
							'reload_fb': $('#reload_fb').attr('checked'),
							'bgFirstPage': $('#bgFirstPage').attr('checked'),
							'message_border': $('#message_border').attr('checked'),
							'message_shadow': $('#message_shadow').attr('checked'),
							'message_bg': $('#message_bg').attr('checked'),
							'barTransparencyNormal': $('#barTransparencyNormal').val(),
							'barTransparencyHover': $('#barTransparencyHover').val(),
							'leftTransparencyNormal': $('#leftTransparencyNormal').val(),
							'leftTransparencyHover': $('#leftTransparencyHover').val(),
							'rightTransparencyNormal': $('#rightTransparencyNormal').val(),
							'rightTransparencyHover': $('#rightTransparencyHover').val(),
							'contentAreaTransparencyNormal': $('#contentAreaTransparencyNormal').val(),
							'contentAreaTransparencyHover': $('#contentAreaTransparencyHover').val(),
							'leftColFixed': $('#left_sidebar_fixed').attr('checked'),
							'rightColFixed': $('#right_sidebar_fixed').attr('checked'),
							'navBarFixed': $('#menu_bar_fixed').attr('checked'),
							'barRoundCorners': $('#barRoundCorners').attr('checked'),
							'barShadows': $('#barShadows').attr('checked'),
							'optlink': $('input[name=optlink]:checked').val(),
							'postShadows': $('#postShadows').attr('checked'),
							'addLogout': $('#addLogout').attr('checked'),
							'changeTitle': $('#changeTitle').attr('checked'),
							'keyboardShortcuts': $('#keyboardShortcuts').attr('checked'),
							'emoticonBar': $('#emoticonBar').attr('checked'),
							'lfdefault': $('#lfdefault').attr('checked'),
							'roboform': $('#roboform').attr('checked'),
							'faviconAlerts': $('#faviconAlerts').attr('checked'),
							'audioalert': $('#audioalert').attr('checked'),
							'audiosound': $('input[name=audiosound]:checked').val(),
							'audioreminder': $('#audioreminder').attr('checked'),
							'audiotimer': $('input[name=audiotimer]:checked').val(),
							'transperentFBBar': $('#menu_bar_transparent').attr('checked'),
							'transperentLeftBar': $('#left_sidebar_transparent').attr('checked'),
							'transperentRightBar': $('#right_sidebar_transparent').attr('checked'),
							'transperentcontentArea': $('#transperentMainContent').attr('checked'),
							'hideReqbox': $('#hideReqbox').attr('checked'),
							'hideAdbox': $('#hideAdbox').attr('checked'),
							'hideEventbox': $('#hideEventbox').attr('checked'),
							'hidePokebox': $('#hidePokebox').attr('checked'),
							'hideConnectbox': $('#hideConnectbox').attr('checked'),
							'hidePageSuggestionbox': $('#hidePageSuggestionbox').attr('checked'),
							'hideSuggestionsbox': $('#hideSuggestionsbox').attr('checked'),
							'hideOnlineFriends': $('#hideOnlineFriends').attr('checked'),
							'hideSyndicationbox': $('#hideSyndicationbox').attr('checked'),
							'optlink_account': $('#optlink_account').attr('checked'),
							'optlink_main': $('#optlink_main').attr('checked')
						});
						location.reload();
						$( this ).dialog( "close" );
					}
				}
			});
		}
		
		
		if (response.options.mainBackgroundType == "0") {
				document.body.style.background = '#FFFFFF !important';
		}
		if (response.options.mainBackgroundType == "1") {
				document.body.style.background = '-webkit-gradient(linear, left top, left bottom, from('+response.options.mainBackgroundGradientFrom+'), to('+response.options.mainBackgroundGradientTo+')) fixed !important';
		}
		if (response.options.mainBackgroundType == "2") {
				document.body.style.background = response.options.mainBackgroundSolid;
		}
		if (response.options.mainBackgroundType == "3") {
			if (response.options.bgIMGTiled){
				var bg_space = document.body;
				var bg_div = document.createElement('div');
				bg_div.className = 'bg';
				bg_space.insertBefore(bg_div, bg_space.firstChild);
	
				style = document.getElementsByTagName('head')[0].appendChild(document.createElement('style'));
				style.type = 'text/css';
				style.innerHTML = ".bg{min-height: 100%; min-width: 1024px; width: 100%; height: auto; position: fixed; top: 0; left: 0; z-index:-10; background-repeat:repeat; background:url(" + response.options.mainBackgroundUrl + ");}";			
			}
			else {
	
				var bg_space = document.body;
				var bg_img = document.createElement('img');
				bg_img.src = response.options.mainBackgroundUrl;
				bg_img.className = 'bg';
				bg_space.insertBefore(bg_img, bg_space.firstChild);
				
				style = document.getElementsByTagName('head')[0].appendChild(document.createElement('style'));
				style.type = 'text/css';
				style.innerHTML = "img.bg{min-height: 100%; min-width: 1024px; width: 100%; height: auto; position: fixed; top: 0; left: 0; z-index:-10;}";
			}
		}
	});	
});